<template>
  <div class="app-wrapper">
    <div class="main-container">
      <!-- 顶部头 -->
      <Header />
      <!-- 底部内容 -->
      <Content />
    </div>
  </div>
</template>

<script setup lang="ts">
  // import Header from '@/layout/default/Header/index.vue';
  // import Content from '@/layout/default/Content/index.vue';
  import Header from '@/layout/5g/Header/index.vue';
  import Content from '@/layout/5g/Content/index.vue';
</script>

<style lang="less" scoped>
  .app-wrapper {
    position: relative;
    height: 100%;
    width: 100%;
  }

  .main-container {
    &::before,
    &::after {
      content: '';
      position: absolute;
      z-index: 11;
      pointer-events: none;
    }

    &::before {
      width: 40px;
      left: 11px;
      height: 100%;
      top: 0;
      background: url('@/assets/images/menu/006.png') left 11px no-repeat;
      background-size: auto 97%;
    }

    &::after {
      height: calc(100% - 155px);
      width: 12px;
      right: 0;
      top: 140px;
      background: url('@/assets/images/menu/005.png') left center no-repeat;
      background-size: auto 100%;
    }
  }
</style>
